<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <link href="res/style.css" rel="stylesheet">
    <script src="http://47.106.66.89:8080/js/vue.min.js"></script>
    <script src="http://47.106.66.89:8080/js/axios.min.js"></script>
</head>
<body>
<div id="app" class="flex">
    <<main>
        <header class="flex">
            <div>
                <h3>源辰银行</h3>
                <small>ycinfo bank</small>
            </div>
            <div id="contact">
                <div>客服电话: 8888</div>
                <div>网址: www.ycinfo.bank.com</div>
            </div>
        </header>
        <div class="msg">
            倒计时: <h2>32</h2> 秒
        </div>
        <div id="pane" class="flex">
            <div class="btns">
                <a class="hidden">占位</a>
                <a class="hidden">占位</a>
                <a class="hidden">占位</a>
            </div>
            <div id="info">
                <h2>查询服务</h2>
                <form action="main.html">
                    <table>
                        <tr><th>序号</th><th>时间</th><th>交易金额</th><th>交易费</th><th>备注</th></tr>
                        <tr v-for="item in operCord">
                            <td>{{item.id}}</td>
                            <td>{{new Date(item.optime).toLocaleString()}}</td>
                            <td>{{item.opMoney}}</td>
                            <td>{{item.charge}}</td>
                            <td>{{item.remark}}</td>
                        </tr>

                    </table>
                    <div id="page" class="right">
                        <a href="#">上一页</a> 1/5 <a href="#">下一页</a>
                    </div>
                </form>
            </div>
            <div class="btns">
                <a class="hidden">占位</a>
                <a class="hidden">占位</a>
                <a class="hidden">占位</a>
                <a @click="main">返回</a>
            </div>
        </div>
    </main>>
</div>
</body>

<script>
    var v = new Vue({
        el:"#app",
        data:{
            operCord:{},
        },
        created(){

        },
        methods:{
            getUrlKey: function (name) {
                return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null
            },
            getoperCord(){
                let params = new URLSearchParams();
                let uid = this.getUrlKey("id");
                params.append("id", uid)
                axios.post("queryByAid", params).then(res=>{
                    if(res.status == 200){
                        this.operCord = res.data;
                        console.log(this.operCord)
                    }
                })
            },
            main(){
                var uid = this.getUrlKey("id");
                location.href = "main.html?id="+uid
            }
        },
        // mounted  页面渲染完成后  要执行的函数
        mounted: function() {
            // 当组件的DOM被挂载到页面上之后，这个函数会被调用
            this.getoperCord();
        }

    })
</script>
</html>
